<template>
    <a-drawer
        :destroyOnClose="true"
        placement="right"
        :closable="true"
        :visible="visible"
        :maskClosable="true"
        :width="width"
        :title="title"
        @close="cancel">
        <a-spin :spinning="confirmLoading">
           
            <!-- 这里放自己的组件 -->
            <div class='qualityManual-container'>
                <div class='qualityManual-container-office'>
                    <onlyoffice id="templateOfficeEdit" :config="config"></onlyoffice>
                </div>
            </div>
            
           
        </a-spin>
       
        <div style="height:30px;"></div>
        

    </a-drawer>
    
</template>

<script>
import pick from 'lodash.pick'
import request from '@/utils/request'
import moment from 'moment'
import {SysMixin} from '@/mixins/SysMixin'
import defaultSettings from '@/config/defaultSettings'
import onlyoffice from '@/utils/onlyoffice/index'


export default {
    name:'contractTemplateEdit',
    components:{onlyoffice},
    mixins:[SysMixin],
   
    data(){
        return{
            width: document.documentElement.clientWidth-200,
            defaultSettings,
            moment,
            visible:false,
            model:{},
            confirmLoading:false,
            title:'标题',
            config: {
                document: {
                   fileType: "docx",
                   key: "",
                   title: "合同模板",
                   url: "",
                   permissions:{
                    download:false,//是否能下载
                    edit:true,//是否可编辑
                    chat:false,//是否启用聊天功能
                    comment:false,//是否可以批注
                    copy:true,//是否可以复制
                    protect:false,//保护按钮是否显示
                   }
               },
               documentType: "word",
               editorConfig: {
                    callbackUrl: "", 
                    lang: "zh-CN", // 中文
                    // "mode": "view",//查看模式
                    mode: "edit",//编辑模式
                    customization:{
                        forcesave:true,
                        autosave:false,
                        help:false,
                        plugins:false,//是否启用插件
                        hideNotes:true,
                        review:{
                            hideReviewDisplay:true
                        }
                    }
               },
           }
            
  
        }
    },
    created(){
    },
    computed:{
       
    },
    watch:{
        
    },
    methods:{
        edit (record) {
            this.visible = true
            this.model = Object.assign({}, record)
            this.config.editorConfig.callbackUrl=this.defaultSettings.devServer+"/WxOnlyofficeController/contractTemplateCallbackSave"
            this.config.document.key=record.fileKey
            this.config.document.url=this.defaultSettings.fileServer+"/"+record.filePath
            this.$nextTick(() => {
               //自己业务
    
            })
          
        },
       
       
        
        ok(){
            this.close()
            this.$emit('handleOk');
        },
        cancel(){
            this.close()
            this.$emit('handleCancel');
        },
        close () {
            this.$emit('close');
            this.visible = false;
        },
        /**
         * 获取form对象
         */
        getForm(){
            return this.$refs.LForm.form
        },
        emitChangeHandler(changeItem){
            this.$emit('handlerChange',changeItem);
        },
        emitClickHandler(field,form){
            this.$emit('handlerClick',field,form);
        },
    }

}
</script>

<style scoped>
.qualityManual-container {
      padding: 0 !important;
      width: 100%;
      height: calc(100vh - 50px);
  }
   
  .qualityManual-container-office {
      width: 100%;
      height: calc(100% - 55px);
  }
</style>



